<template>
  <div>
    <z-table ref="table" rowKey="id" :showAlert="false" :showSelection="false" :loading="loading" :columns="columns"
      :dataSource="pageData" @change="onTableChange">
      <template slot="detectNum" slot-scope="text">
        <span>第{{ text }}次</span>
      </template>
      <template slot="urineTime" slot-scope="text, record">
        <span>{{ record.urineStartTime }} ~ {{ record.urineEndTime }}</span>
      </template>
      <template slot="urineAppointmentTime" slot-scope="text, record">
        <span>{{ record.urineAppointmentStartTime }} ~ {{ record.urineAppointmentEndTime }}</span>
      </template>
      <template slot="noticeStatus" slot-scope="text">
        <span v-if="text == '1'">已通知</span>
        <span v-if="text == '2'">待通知</span>
      </template>
      <template slot="status" slot-scope="text">
        <span v-if="text == '1'">待预约</span>
        <span v-if="text == '2'">待检测</span>
        <span v-if="text == '3'">补录申请中</span>
        <span v-if="text == '4'">取消申请中</span>
        <span v-if="text == '5'">已逾期</span>
        <span v-if="text == '6'">已完成</span>
        <span v-if="text == '7'">已取消</span>
        <span v-if="text == '8'">待开始</span>
      </template>
      <template slot="detectResult" slot-scope="text">
        <span v-if="text == '1'">阴</span>
        <span v-if="text == '2'" style="color:#D9001B">阳</span>
      </template>
      <template slot="recheckResult" slot-scope="text">
        <span v-if="text == '1'">阴</span>
        <span v-if="text == '2'" style="color:#D9001B">阳</span>
      </template>
      <!--操作-->
      <template slot="action" slot-scope="text, record">
        <template v-if="record.status == '1'">
          <a-button @click="onBooking(2, record)" type="link" style="padding: 0">检测预约
          </a-button>
          <a-divider type="vertical" />
        </template>
        <template v-if="isUroscopy">
          <template v-if="record.status == '1' || record.status == '2'">
            <a-button @click="onInput(record)" type="link" style="padding: 0">检测录入</a-button>
            <a-divider type="vertical" />
          </template>
        </template>
        <template v-if="record.status == '2' && urineType != 2 && urineType != 4">
          <a-button @click="onBooking(3, record)" type="link" style="padding: 0">改约</a-button>
          <a-divider type="vertical" />
        </template>
        <template v-if="record.status == '3' || record.status == '4'">
          <a-button @click="onCYX(record)" type="link" style="padding: 0">催一下</a-button>
          <a-divider type="vertical" />
        </template>
        <template v-if="record.status == '3' || record.status == '4'">
          <a-button @click="onCX(record)" type="link" style="padding: 0">撤销申请</a-button>
          <a-divider type="vertical" />
        </template>
        <template v-if="isUroscopy && record.status == '5'">
          <a-button @click="onInput(record)" type="link" style="padding: 0">检测补录</a-button>
          <a-divider type="vertical" />
        </template>
        <template v-if="!isUroscopy">
          <template v-if="record.recheckStatus == '2'">
            <a-button @click="onInput2(record)" type="link" style="padding: 0">司法复检</a-button>
            <a-divider type="vertical" />
          </template>
          <template v-if="record.recheckStatus == '3'">
            <a-button @click="onInput(record)" type="link" style="padding: 0">司法结果</a-button>
            <a-divider type="vertical" />
          </template>
        </template>
<!--        <template v-if="record.status != '1'">-->
<!--          <a-button @click="onDetail(record)" type="link" style="padding: 0">查看</a-button>-->
<!--          <a-divider type="vertical" />-->
<!--        </template>-->
        <template v-if="record.status == '1' || record.status == '2' || record.status == '5'">
          <a-button @click="onCancel(record)" type="link" style="padding: 0">取消</a-button>
        </template>
      </template>
    </z-table>
<!--    <BookingModal ref="scheduleModalId" :title="bookTitle" :isUroscopy=isUroscopy @ok=onQuery />-->
<!--    <AddModal ref="addModalId" title="尿液检测结果" :isUroscopy="isUroscopy" @ok=onQuery />-->
<!--    <AddModal2 ref="addModal2Id" @ok=onQuery />-->
<!--    <CancelModal ref="cancelModalId" @ok=onQuery />-->
<!--    <DetailModal ref="detailModalId" />-->
  </div>
</template>
<script>
// import BookingModal from './BookingModal'
// import AddModal from './AddModal'
// import AddModal2 from './AddModal2'
// import CancelModal from './CancelModal'
// import DetailModal from './DetailModal'
import * as uroscopyApi from '@/api/sjsk/check/uroscopy.js'
import { getUrge } from '@/api/sjsk/flowService'
export default {
  props: ['isUroscopy'],
  components: {
    // BookingModal,
    // AddModal,
    // AddModal2,
    // CancelModal,
    // DetailModal,
  },

  data() {
    return {
      loading: false,
      columns: [],
      columns1: [
        {
          title: '序号',
          dataIndex: 'order',
          width: 60,
          align: 'center',
          customRender: (text, record, index) =>
            `${(this.pageFilter.pageNo - 1) * this.pageFilter.pageSize + (index + 1)}` //序号分页后连续
        },
        {
          title: '检测次数',
          dataIndex: 'detectNum',
          align: 'center',
          scopedSlots: { customRender: 'detectNum' },
        },
        {
          title: '计划时间',
          dataIndex: 'urineTime',
          align: 'center',
          scopedSlots: { customRender: 'urineTime' },
        },
        {
          title: '预约时间',
          dataIndex: 'urineAppointmentTime',
          align: 'center',
          scopedSlots: { customRender: 'urineAppointmentTime' }
        },
        {
          title: '通知状态',
          dataIndex: 'noticeStatus',
          align: 'center',
          scopedSlots: { customRender: 'noticeStatus' },
        },
        {
          title: '录入状态',
          dataIndex: 'status',
          align: 'center',
          scopedSlots: { customRender: 'status' },
        },
        {
          title: '检测结果',
          dataIndex: 'detectResult',
          align: 'center',
          scopedSlots: { customRender: 'detectResult' },
        },
        {
          title: '检测时间',
          dataIndex: 'actualDetectTime',
          align: 'center',
        },
        // {
        //   title: '操作',
        //   width: 250,
        //   align: 'center',
        //   dataIndex: 'action',
        //   scopedSlots: { customRender: 'action' },
        // },
      ],
      columns2: [
        {
          title: '序号',
          dataIndex: 'order',
          width: 60,
          align: 'center',
          customRender: (text, record, index) =>
            `${(this.pageFilter.pageNo - 1) * this.pageFilter.pageSize + (index + 1)}` //序号分页后连续
        },
        {
          title: '检测次数',
          dataIndex: 'detectNum',
          align: 'center',
          scopedSlots: { customRender: 'detectNum' },
        },
        {
          title: '计划时间',
          dataIndex: 'urineTime',
          align: 'center',
          scopedSlots: { customRender: 'urineTime' },
        },
        {
          title: '预约时间',
          dataIndex: 'urineAppointmentTime',
          align: 'center',
          scopedSlots: { customRender: 'urineAppointmentTime' }
        },
        {
          title: '通知状态',
          dataIndex: 'noticeStatus',
          align: 'center',
          scopedSlots: { customRender: 'noticeStatus' },
        },
        {
          title: '录入状态',
          dataIndex: 'status',
          align: 'center',
          scopedSlots: { customRender: 'status' },
        },
        {
          title: '初筛结果',
          dataIndex: 'detectResult',
          align: 'center',
          scopedSlots: { customRender: 'detectResult' },
        },
        {
          title: '司法结果',
          dataIndex: 'recheckResult',
          align: 'center',
          scopedSlots: { customRender: 'recheckResult' },
        },
        {
          title: '检测时间',
          dataIndex: 'actualDetectTime',
          align: 'center',
        },
        // {
        //   title: '操作',
        //   width: 250,
        //   align: 'center',
        //   dataIndex: 'action',
        //   scopedSlots: { customRender: 'action' },
        // },
      ],
      pageFilter: {
        pageNo: 1,
        pageSize: 10,
      },
      sjskPersonId: this.$store.state.holographicArchives.routeObjData.sjskId,
      urineType: 1, //默认常规尿检
      pageData: {},
      bookTitle: "尿液检测预约"
    }
  },
  created() {
    this.init(this.isUroscopy)
    console.log(this.sjskPersonId)
  },
  watch: {
    isUroscopy(val) {
      this.init(val)
    },
  },
  methods: {
    init(val) {
      if (val) {
        this.columns = this.columns1
        this.bookTitle = "尿液检测预约"
      } else {
        this.columns = this.columns2
        this.bookTitle = "毛发检测预约"
      }
    },
    onQuery() {
      this.pageFilter.pageNo = 1
      this.refreshTable()
    },
    onTableChange(pagination, pageFilter, sorter) {
      let keyMap = { currentPage: 'pageNo' }
      let paginations = Object.keys(pagination).reduce((newData, key) => {
        let newKey = keyMap[key] || key
        newData[newKey] = pagination[key]
        return newData
      }, {})
      this.pageFilter = Object.assign({}, this.pageFilter, paginations)
      this.refreshTable()
    },
    refreshTable() {
      console.log(this.sjskPersonId)
      this.loading = true
      let params = Object.assign(this.pageFilter, { sjskPersonId: this.sjskPersonId, urineType: this.urineType })
      uroscopyApi.sjskUrineData(params).then((res) => {
        if (res.success) {
          this.pageData = res.result ? res.result : {}
          this.loading = false
        } else {
          this.loading = false
        }
      })
        .catch((e) => {
          this.loading = false
          this.$message.warn('请求失败！')
        })
    },
    setUrineType(type) {
      this.urineType = type
    },
    onBooking(type, record) {
      if (type == 1) { //预约(突击尿检)
        this.$refs.scheduleModalId.show(1) //列表数据回填
      }
      if (type == 2) { //预约(常规尿检)
        this.$refs.scheduleModalId.show(2, record) //列表数据回填
      }
      if (type == 3) { //改约
        this.getYYdetail(record.id) //获取预约的数据并回填
      }
    },
    getYYdetail(id) {
      uroscopyApi.urineDetail(id).then(res => {
        if (res.success) {
          this.$refs.scheduleModalId.show(3, res.result) //列表数据回填
        }
      })
    },
    onInput(record) {
      if (this.isUroscopy) {
        uroscopyApi.urineDetail(record.id).then(res => {
          if (res.success) {
            if (res.result != null) {
              let obj = {
                id: res.result.id,
                sjskPersonId: res.result.sjskPersonId,
                realName: res.result.realName,
                identityCard: res.result.identityCard,
                urineType: res.result.urineType,
                detectNum: res.result.detectNum
              }
              this.$refs.addModalId.show(obj)
            }
          }
        })
      } else {
        this.$refs.addModalId.show(record)
      }
    },
    onInput2(record) {
      this.$refs.addModal2Id.show(record)
    },
    onDetail(record) {
      this.$refs.detailModalId.show(record.id)
    },
    onCancel(record) {
      this.$refs.cancelModalId.show(record)
    },
    onCYX(record) {
      getUrge({ taskId: record.id, taskType: '19' }).then((res) => { //取消常规尿液检测审批
        if (res.success) {
          this.$message.success(res.message);
          this.onQuery()
        } else {
          this.$message.warning(res.message);
        }
      });
      // uroscopyApi.urge({ businessId: record.id, urineType: record.urineType }).then((res) => {
      //   if (res.success) {
      //     this.$message.success(res.message);
      //     this.onQuery()
      //   } else {
      //     this.$message.warning(res.message);
      //   }
      // });
    },
    onCX(record) {
      let that = this;
      let flowType = ""
      if (this.urineType == 1) flowType = "18" //常规尿检,流程类型18
      if (this.urineType == 2) flowType = "19" //突击尿检,流程类型19
      this.$confirm({
        title: `还在审批中，确定要撤销吗?`,
        okText: "确认",
        okType: "danger",
        cancelText: "取消",
        onOk() {
          uroscopyApi.undoApply({ taskId: record.id, type: flowType }).then((res) => {
            if (res.success) {
              that.$message.success(res.message);
              that.onQuery()
            } else {
              that.$message.warning(res.message);
            }
          });
        }
      });
    },
  },
}
</script>
<style lang="less" scoped>

</style>
